<template>
<div class="userAdd-wrapp">
  <el-dialog :title="title" :visible.sync="dialogVisible" width="1000px" :before-close="close">
    <el-form :model="fromData" :rules="rules" ref="Uform" label-width="120px" :inline="false">

      <div class="clear useritemBox">
        <el-form-item label="是否禁用：" prop="disenable" class="item-box">
         <el-radio v-model="fromData.disenable" :label="0">禁用</el-radio>
         <el-radio v-model="fromData.disenable" :label="1">启用</el-radio>
        </el-form-item>
        <el-form-item label="入职日期：" prop="entrydate" class="item-box">
          <el-date-picker v-model="fromData.entrydate" value-format="yyyy-MM-dd H:mm:ss" :picker-options="pickerOptions" type="date" placeholder="选择日期"> </el-date-picker>
        </el-form-item>
      </div>
      <div class="clear useritemBox">
        <div class="item-box">
           <el-form-item label="选择所属公司：" class="item_style">
              <el-select v-model="fromData.companyid" placeholder="请选择" @change="get_Departmentid" style="width:227px">
                 <el-option
                   v-for="item in companyInfo"
                   :label="item.companyname"
                   :value="item.companyid">
                 </el-option>
              </el-select>
           </el-form-item>
         </div>
         <div class="item-box">
           <el-form-item label="是否是管理者：" prop="ismanager" class="item_style">
             <el-radio v-model="fromData.ismanager" :label="1">是</el-radio>
             <el-radio v-model="fromData.ismanager" :label="0">否</el-radio>
           </el-form-item>
        </div>
       </div>

      <div class="clear useritemBox" >
        <el-form-item label="用户所属部门：" prop="departmentid"  class="item-box">
          <el-select v-model="fromData.departmentid" placeholder="请选择" title="请先选择所属公司" style="width:227px">
           <el-option label="无部门" :value='0'></el-option>
          <el-option
            v-for="item in departmentDown"
            :label="item.deptname"
            :value="item.id">
          </el-option>
        </el-select>
        </el-form-item>
      </div>

<div class="clear useritemBox">

      <el-form-item label="用户类型：" prop="usertype" class="item-box">
        <el-radio v-model="fromData.usertype" label="VIP" disabled>VIP</el-radio>
        <el-radio v-model="fromData.usertype" label="普通员工">普通员工</el-radio>
      </el-form-item>

    <div class="item-box">
        <el-form-item label="手机号：" prop="mobile" class="item_style" v-if="dialogType==='edit'">
         <el-input v-model="fromData.mobile" disabled></el-input>
        </el-form-item>

        <el-form-item label="手机号：" prop="mobile" class="item_style" v-else>
         <el-input v-model="fromData.mobile"></el-input>
        </el-form-item>
    </div>
</div>

<div class="clear useritemBox">
  <div class="item-box">
      <el-form-item label="优先级排序值：" prop="orderindex" class="item_style">
       <el-input v-model="fromData.orderindex"></el-input>
      </el-form-item>
  </div>
  <div class="item-box">
      <el-form-item label="用户工号：" prop="userid" class="item_style">
       <el-input v-model="fromData.userid"></el-input>
      </el-form-item>
  </div>
</div>

  <div class="clear useritemBox">
    <div class="item-box">
      <el-form-item label="姓名：" class="item_style">
       <el-input v-model="fromData.username"></el-input>
      </el-form-item>
    </div>
    <div class="item-box">
      <el-form-item label="性别：" prop="sex" class="item_style">
        <el-radio v-model="fromData.sex" label="男">男</el-radio>
        <el-radio v-model="fromData.sex" label="女">女</el-radio>
      </el-form-item>
    </div>
  </div>

 <div class="clear useritemBox">
     
      <el-form-item label="注册标识：" prop="registerflag" class="item-box">
       <el-radio v-model="fromData.registerflag" :label="0">邀请</el-radio>
       <el-radio v-model="fromData.registerflag" :label="1">注册</el-radio>
      </el-form-item>
 
      <el-form-item label="在职状态：" prop="workstate" class="item-box">
       <el-radio v-model="fromData.workstate" label="在职">在职</el-radio>
       <el-radio v-model="fromData.workstate" label="离职">离职</el-radio>
       <el-radio v-model="fromData.workstate" label="解雇">解雇</el-radio>
       <el-radio v-model="fromData.workstate" label="自离">自离</el-radio>
      </el-form-item>
     
</div>



  <div class="clear useritemBox">
       <el-form-item label="角色：" prop="registerflag" class="item-box">
           <el-checkbox-group v-model="rolebound" size="mini" >
           <el-checkbox :label="item.roleid" border v-for="item in orderData">{{item.rolename}}</el-checkbox>
         </el-checkbox-group>
       </el-form-item>
   </div>
</el-form>
    <!-- 权限 -->
    <!-- <div>
      <h2>角色</h2>
      <div class="roleBox">
        <el-radio-group v-model="rolebound" size="mini">
          <el-radio :label="item.roleid" border v-for="item in orderData">{{item.rolename}}</el-radio>
        </el-radio-group>
        {{rolebound}}
      </div>
    </div> -->
    <div style="text-align:right;padding-bottom:10px;">
      <el-button type="primary" v-if="dialogType === 'add'" @click="submitForm">立即添加</el-button>
      <el-button type="primary" v-else-if="dialogType === 'edit'" @click="update_submitForm">修改</el-button>
      <el-button @click="close">取 消</el-button>
    </div>
</el-dialog>
</div>
</template>

<script>
  export default {
    props:['dialogVisible','submitFn','submitFn2','PropData','dialogType','orderData','companyInfo','getUserRoleInfoList'],
    data() {
      return {
        rules:{
          disenable:[
              { required: true, message: '公司名称不能为空', trigger: 'blur' }
          ],
          entrydate:[
              { required: true, message: '不能为空', trigger: 'blur' }
          ],
          ismanager:[
              { required: true, message: '不能为空', trigger: 'blur' }
          ],
          mobile:[
              { required: true, message: '不能为空', trigger: 'blur' }
          ],
          orderindex:[
              { required: true, message: '不能为空', trigger: 'blur' }
          ],
          mypagesize:[
              { required: true, message: '不能为空', trigger: 'blur' }
          ],
          userid:[
              { required: true, message: '不能为空', trigger: 'blur' }
          ],
          username:[
              { required: true, message: '不能为空', trigger: 'blur' }
          ],
          sex:[
              { required: true, message: '不能为空', trigger: 'blur' }
          ],
          registerflag:[
              { required: true, message: '不能为空', trigger: 'blur' }
          ],
          workstate:[
              { required: true, message: '不能为空', trigger: 'blur' }
          ]
        },
        fromData:{
          disenable:1,
          ismanager:0,
          usertype:'普通员工',
          workstate:'在职',
          sex:'男',
          orderindex:100,
          departmentid:'',
          registerflag:1
        },
        departmentDown:'',
        rolebound:[],
        title:'添加用户',
        pickerOptions:{
            //設置選擇時間不可大於以後的時間
            disabledDate(time) {
             return time.getTime() > Date.now();
            }
          }
      }
    },
    methods: {
      isManage(row, column){
        return (row.ismanager)? "是":"否";
      },
      update_submitForm(){//修改
        this.$refs['Uform'].validate((valid) => {
           if (valid) {
             // 保存角色与用户的关系表数据所需要的参数
             let roleUserDtos = [];
             let saveRoleInfoParams = {};
             for(let key in this.rolebound){
                for(let keys in this.orderData){
                  if(this.orderData[keys].roleid === this.rolebound[key]){
                      let obj = {};
                      obj.roleName = this.orderData[keys].rolename;
                      obj.roleId = this.orderData[keys].roleid;
                      obj.usermapId = this.PropData.id;
                      roleUserDtos.push(obj);
                  }
                }
             }
             saveRoleInfoParams.roleUserDtos=roleUserDtos;
             saveRoleInfoParams.usermapId = this.PropData.id;

             this.fromData.uid =this.PropData.uid;
             this.submitFn2(this.fromData,saveRoleInfoParams);
           }else{
               this.$message.error("必填项不能为空");
           }
        })
      },
      submitForm() {
        this.$refs['Uform'].validate((valid) => {
           if (valid) {
             let roleUserDtos = [];
             let saveRoleInfoParams = {};
             for(let key in this.rolebound){
                for(let keys in this.orderData){
                  if(this.orderData[keys].roleid === this.rolebound[key]){
                      let obj = {};
                      obj.roleName = this.orderData[keys].rolename;
                      obj.roleId = this.orderData[keys].roleid;
                      obj.usermapId = 0;
                      roleUserDtos.push(obj);
                  }
                }
             }
               // this.fromData.departmentid = 0;
             // saveRoleInfoParams.roleUserDtos=roleUserDtos;
             // saveRoleInfoParams.usermapId = 0;
             // this.fromData.companyid = this.$store.getters.companyId;
             this.fromData.roleUserDtos = roleUserDtos;
             if(this.fromData.departmentid === ''){
               this.fromData.departmentid = 0;
             }
             this.submitFn(this.fromData);
           }else{
               this.$message.error("必填项不能为空");
           }
        })
      },
      close(){
        this.$emit('update:dialogVisible', false)
      },
      get_Departmentid(val){  //获取部门信息
        // alert(val);
        this.$post("/dept/getDeptCompanyidone",{companyid:val},data => {
            this.departmentDown = data;
          },error => {
            this.$message.error(data);
        });
        this.getUserRoleInfoList(0,this.fromData.companyid);
      }
    },
    created(){
      // this.get_Departmentid();
     if(this.dialogType==="edit"){
       this.title = "修改用户信息"
        this.fromData = this.PropData;
        this.get_Departmentid(this.PropData.companyid);
        for(let key in this.orderData){
          if(this.orderData[key].status === 1){
            this.rolebound.push(this.orderData[key].roleid);
          }
        }

      }
    }
  }
</script>
<style scoped lang="scss">
  .userInfo-wrapp{
    .user-table{
        margin-top: 15px;
    }
  }
  .fl{
    float: left;
  }
 .qc_{
   clear: both;
 }
 .block{
  margin-left: 7%;
 }
 .useritemBox{

 }
 .item-box{
   width: 50%;
   float: left;
 }
 .roleBox{
   padding-top: 15px;
 }
 .item_style{
  width:350px;
 }
</style>
